<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>小米首页</title>
		<!-- 基本结构：定义css样式表 -->
		<link rel="stylesheet" href="css/header.css" />
		<link rel="stylesheet" href="css/main.css" />
		<link rel="stylesheet" href="css/footer.css" />
		<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
	</head>
	<body>
		<!-- 页面：页头、主体、页尾【切片】
		     按照页面基本结构结合 “结构化元素” 搭建页面
			 header元素----页头部分---结构化元素
			 主导航、登录、购物车
			 布局：左右布局结构
			 main元素------主体部分---结构化元素
			 footer元素----页尾部分---结构化元素
		 -->
		 <!-- 1.页头部分 -->
		 <header>
			 <div id="wrapper">
			 	<div class="left">
				<ul>
					<li><a href="#">小米网</a></li>
					<li><a href="#">MIUI</a></li>
					<li><a href="#">米聊</a></li>
					<li><a href="#">游戏</a></li>
					<li><a href="#">多看阅读</a></li>
					<li><a href="#">云服务</a></li>
					<li><a href="#">小米网移动版</a></li>
					<li><a href="#">问题反馈</a></li>
					<li><a href="#" class="fix">Select Region</a></li>
				</ul>
				</div>
			 	<div class="right">
				<ul>
					<li><a href="#" class="line">登录</a></li>
					<li><a href="#" class="line1">注册</a></li>
					<li><a href="#" class="line2"><i class="fas fa-shopping-cart"></i>购物车(0)</a></li>
					</ul>
			 </div>
			</div>
			
		 </header>
		 <!-- 2.主体部分 -->
		 <main>
			 <div id="daohang">
			 <div class="1eft"></div>
			 <ul class="list">
			 <li><a href="#">小米盒子</a></li>
			 <li><a href="#">红米</a></li>
			 <li><a href="#">平板</a></li>
			 <li><a href="#">电视</a></li>
			 <li><a href="#">盒子</a></li>
			 <li><a href="#">路由器</a></li>
			 <li><a href="#">智能硬件</a></li>
			 <li><a href="#">服务</a></li>
			 <li><a href="#">社区</a></li>
			 </ul>
			 <div class="right">
			 </div>
			 </div>
		 </main>
		 <!-- 3.页尾部分 -->
		 <footer></footer>
	</body>
</html>